.progress {
    padding: 4px 0;
    cursor: pointer;
}

.progress:hover .duration {
    height: 6px;
}

.progress:hover .current-point {
    width: 10px;
    height: 10px;
}

.progress .duration {
    position: relative;
    background: rgba(255, 255, 255, 0.4);
    width: 100%;
    height: 2px;
    border-radius: 2px;
}

.progress .current-time {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.5);
    width: 0;
}

.progress .current-point {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    background: #fff;
    border-radius: 50%;
    width: 2px;
    height: 2px;
}

